import React from 'react';
import { Checkbox } from 'antd';
const CheckboxGroup = Checkbox.Group;

const CheckboxAllGroup = React.createClass({
    getInitialState() {
        return {
            checkAll: false
        };
    },
    componentWillMount() {
        this.state.value = this.props.value;
        this.state.checkAll = (this.props.options.length === this.props.value.length);
    },
    componentWillReceiveProps (nextProps) {
        this.state.value = nextProps.value;
        this.state.checkAll = (nextProps.options.length === nextProps.value.length);
    },

    render() {
        if (this.needNotifyCheckChange) {
            if (this.props.onCheckChange) {
                this.props.onCheckChange({ module: this.props.module, value: this.state.value });
            }
            this.needNotifyCheckChange = false;
        }

        return (
            <div>
                <div className="checkboxGroupList"><CheckboxGroup
                    options={this.props.options} value={this.state.value}
                    onChange={this.onChange} /></div>
                <Checkbox onChange={this.onCheckAllChange}
                    checked={this.state.checkAll} />
                <div className="clear"></div>
            </div>
        );
    },
    onChange(checkedList) {
        this.setState({
            value: checkedList,
            checkAll: (this.props.options.length === this.props.value.length)
        });
        this.needNotifyCheckChange = true;
    },
    onCheckAllChange(e) {
        this.setState({
            value: e.target.checked ? this.props.defaultOptions : [],
            checkAll: e.target.checked,
        });

        this.needNotifyCheckChange = true;
        //alert(this.state.value);
    },
});

export default CheckboxAllGroup;